<p>list works!</p>
<!-- *ngFor -->
<ul>
    <li *ngFor="let item of ['aa','ss']; let i=index">{{item}}</li>
</ul>
<!-- *ngIf -->
<p *ngIf="isShow">命令模式{{ isShow }}</p>
<p *ngIf="!isShow">命令模式{{ isShow }}</p>

<p [class.hidden]="isShow">class模式</p>


<!-- click -->
<button on-click = "eventFunc()">on-click</button>
<button (click) = "eventFunc()">(click)</button>

<!-- 双向数据绑定 -->

<br>
<input [(ngModel)] = "name" type="text"> 
<!-- <input bindon-change="name" type="text"> -->
{{ name }}

<!-- 生命周期 -->
<!-- 
ngOnChanges():当被绑定的输入属性的值发生变化时调用，首次调用一会发生在ngOnlnit()之前。
ngOnlint():在第一轮ngOnChanges() 完成之后调用，只调用一次，在Angular第一次显示数据绑定和设置指令、组件的输入属性之后，初始化指令、组件、获取初始数据的好地方
ngDoCheck():紧跟在每次执行变更检测时的ngOnChanges()和首次执行变更检测时的ngOnlint()后调用
ngAfterContentInit():第一次ngDoCheck()之后调用，只调用一次，用途：当Angular把外部内容投影进组件视图或指令
ngAfterViewInit():第一次ngAfterContentChecked()调用之后，只调用一次，用途：初始化完组件视图及其子视图之后调用
ngAfterViewChecked():ngAfterViewInit() 和每次 ngAfterContentChecked() 之后调用，用途：每次做完组件视图和子视图的变更检测之后调用
ngOnDestroy():在Angular销毁指令/组件之前调用。用途：当Angular每次销毁指令/组件之前调用，此处可以取消订阅可观察对象；清除定时器；反注册该指令在全局或应用服务中注册过的所有回调 -->


11/25
<!-- ui库的使用 -->
<mat-card>Simple card</mat-card>
<button mat-button color="primary">Primary</button>
<button mat-button color="accent">Accent</button>
<!-- 表单处理ngFrom -->
<label>Name:
    <input type="text" [formControl]="inputs">
 </label>
<!-- 原生 -->